import QtQuick 1.0

Component {
    id: listDelegate


    /*
    function accountClicked() {
        imageDetails.photoTitle = title;
        imageDetails.photoTags = tags;
        imageDetails.photoWidth = photoWidth;
        imageDetails.photoHeight = photoHeight;
        imageDetails.photoType = photoType;
        imageDetails.photoAuthor = photoAuthor;
        imageDetails.photoDate = photoDate;
        imageDetails.photoUrl = url;
        imageDetails.rating = 0;
        scaleMe.state = "Details";

        delegateItem.state = "Details";
    }
        */

    Item {
        id: delegateItem
        width: listView.width; height: 55
        clip: true

        Row {
            anchors.verticalCenter: parent.verticalCenter
            spacing: 10

            Column {
                /*
                Image {
                    source: "content/pics/arrow-up.png"
                    //MouseArea { anchors.fill: parent; onClicked: accountModel.move(index, index-1, 1) }
                    MouseArea { anchors.fill: parent; onClicked: container.state = 'DetailsView' }
                }
                Image { source: "content/pics/arrow-down.png"
                    //MouseArea { anchors.fill: parent; onClicked: accountModel.move(index, index+1, 1) }
                    MouseArea { anchors.fill: parent; onClicked: container.state = 'DetailsView' }
                }
                */
            }

            Column {
                anchors.verticalCenter: parent.verticalCenter

                Text {
                    text: name
                    font.pixelSize: 15
                    color: "white"
                }
                Row {
                    spacing: 5
                    Repeater {
                        model: attributes
                        Text { text: description; color: "White" }
                    }
                }
            }
        }

        Row {
            anchors.verticalCenter: parent.verticalCenter
            anchors.right: parent.right
            spacing: 10

            Text {
                id: costText
                anchors.verticalCenter: parent.verticalCenter
                text: Number(cost).toFixed(2) + '%'
                font.pixelSize: 15
                color: "white"
                font.bold: true
            }
            /*
            Image {
                source: "content/pics/list-delete.png"
                MouseArea { anchors.fill:parent; onClicked: accountModel.remove(index) }
            }
            */
        }


        // Animate adding and removing of items:

        ListView.onAdd: SequentialAnimation {
            PropertyAction { target: delegateItem; property: "height"; value: 0 }
            NumberAnimation { target: delegateItem; property: "height"; to: 55; duration: 250; easing.type: Easing.InOutQuad }
        }

        ListView.onRemove: SequentialAnimation {
            PropertyAction { target: delegateItem; property: "ListView.delayRemove"; value: true }
            NumberAnimation { target: delegateItem; property: "height"; to: 0; duration: 250; easing.type: Easing.InOutQuad }

            // Make sure delayRemove is set back to false so that the item can be destroyed
            PropertyAction { target: delegateItem; property: "ListView.delayRemove"; value: false }
        }

        //MouseArea { anchors.fill: delegateItem; onClicked: accountClicked() }
        MouseArea { anchors.fill: delegateItem; onClicked: background.state = 'DetailsView' }
        /*
        Connections {
            target: toolBar
            onButton2Clicked: if (delegateItem.state == 'Details' ) delegateItem.state = 'Show'
        }

        states: [
            State {
                name: "Show";
                //PropertyChanges { target: scaleMe; scale: 1 }
            },
            State {
                name: "Details"
                //PropertyChanges { target: scaleMe; scale: 1 }
                //ParentChange { target: whiteRect; x: 10; y: 20; parent: imageDetails.frontContainer }
                //PropertyChanges { target: background; state: "DetailedView" }
            }
        ]
        transitions: [
            Transition {
                from: "Show"; to: "Details"
                ParentAnimation {
                    via: foreground
                    NumberAnimation { properties: "x,y"; duration: 500; easing.type: Easing.InOutQuad }
                }
            },
            Transition {
                from: "Details"; to: "Show"
                ParentAnimation {
                    via: foreground
                    NumberAnimation { properties: "x,y"; duration: 500; easing.type: Easing.InOutQuad }
                }
            }
        ]
        */

    }
}
